<!DOCTYPE html>
<html ng-app="planAdd" ng-cloak>
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link href="/lib/bootstrap/css/bootstrap.min.css" rel="stylesheet">
    <link href="/lib/bootstrap/css/bootstrap-switch.min.css" rel="stylesheet">
    <link href="/lib/fontAwesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="/lib/navbar/css/responsive-menu.css" rel="stylesheet">
    <link href="/lib/bootstrap-datetime/css/jquery.datetimepicker.css" rel="stylesheet" media="screen">
    <link rel="stylesheet" type="text/css" href="/lib/angular-toastr/dist/angular-toastr.css"/>
    <link rel="stylesheet" href="/lib/angular-ui-select/dist/select.css">
    <link rel="stylesheet" href="/lib/jquery-ui/jquery-ui.min.css">
    <link href="/css/style.css" rel="stylesheet">

    <script src="/lib/jquery/jquery.min.js"></script>
    <script src="/lib/jquery/jquery.cookie.min.js"></script>
    <script src="/lib/bootstrap/js/bootstrap.min.js"></script>
    <script src="/lib/bootstrap/js/bootstrap-switch.min.js"></script>
    <script src="/lib/navbar/js/modernizr.min.js" type="text/javascript"></script>
    <script src="/lib/navbar/js/modernizr-custom.js" type="text/javascript"></script>
    <script src="/lib/navbar/js/responsive-menu.js" type="text/javascript"></script>
    <script src="/lib/angular/angular.js"></script>
    <script src="/lib/angular-toastr/dist/angular-toastr.tpls.js"></script>
    <script src="/lib/angular-ui-select/dist/select.js"></script>
    <script src="/lib/jquery-ui/jquery-ui.min.js"></script>
    <script src="/js/directives.js"></script>
    <script src="/lib/bootstrap-datetime/js/jquery.datetimepicker.js"></script>
    <script src="/js/planAddController.js"></script>

    <title>计划安排</title>
</head>
<body ng-controller="planAddController">
<% include navbar %>
<div class="col-md-12 form-group" style="margin-top:30px">
    <div class="col-md-12">
        <div class="form-horizontal col-md-12 margin-top-40">
            <div style="position: relative;top:-25px;left:-5%">
                <h4 style="font-weight: bold" class="col-md-2 control-label">是否自动发布</h4>

                <div class="col-md-1" id="switchValue" value='<%- setting.on_off %>'>
                    <input type="checkbox" class="switch" bootstrap-switch="autoPublish" data-on="primary"
                           data-off="danger">
                </div>

                <a href="javascript:history.back()" class="btn btn-warning fa btn-lg fa-angle-left col-md-offset-12"
                   style="position:relative;left:-20px;top:-35px;">&nbsp;返回</a>
            </div>
        </div>

        <div class="manual col-md-6 form-horizontal">
            <div class="col-md-12 kick-padding-margin">
                <h2 class="group-head"><span>新建计划安排</span></h2>
            </div>
            <div class="col-md-12 margin-top-40">
                <div class="form-group">
                    <label class="col-md-2 control-label" style="text-align: center">计划名称</label>

                    <div class="col-md-10">
                        <input type="text" class="form-control toggle-left" ng-model="plan.plan_name" />
                    </div>
                </div>

                <div class="form-group margin-top-40">
                    <label class="col-md-2 control-label" style="text-align: center">起止时间</label>

                    <div class="col-md-5">
                        <input type="text" id="start" class="form-control toggle-left" ng-model="plan.start_date"  />
                        <span style="position: relative;top:-27px;left:103%">~</span>
                    </div>
                    <div class="col-md-5">
                        <input type="text" id="end" class="form-control toggle-left"  ng-model="plan.end_date" />
                    </div>
                </div>

                <div class="form-group margin-top-40" style="position: relative;top:-15px;">
                    <label class="col-md-2 control-label" style="text-align: center">后续安排</label>

                    <div class="col-md-10">
                        <textarea class="form-control toggle-left" ng-model="plan.next_plan" ></textarea>
                    </div>
                </div>

                <button class="btn btn-primary col-md-6 col-md-offset-3 margin-top-20 fa fa-pencil-square-o toggle-left" ng-click="emitPlan()">
                    &nbsp;&nbsp;发布计划</button>
            </div>
        </div>

        <div class="auto col-md-6">
            <div class="col-md-12 kick-padding-margin">
                <h2 class="group-head"><span>自动发布设置</span></h2>
            </div>

            <div class="col-md-12 margin-top-40 form-horizontal">

                <div class="form-group">
                    <label class="col-md-2 control-label" style="text-align: center">发布周期</label>
                    <div class="col-md-10">
                        <div class="col-md-1 control-label">每</div>
                        <div class="col-md-4">
                            <input type="number" class="form-control toggle-right" ng-model="setting.freq_interval" id="freqInterval" value="<%- setting.freq.split('/')[0] %>"/>
                        </div>
                        <div class="col-md-1 control-label" style="padding-left:0">周</div>

                        <div class="col-md-2 control-label">星期</div>
                        <div class="col-md-4" id="freqWeek" value="<%- setting.freq.split('/')[1] %>">
                            <ui-select class="toggle-right" ng-model="setting.freq_week" append-to-body="true">
                                <ui-select-match>{{ $select.selected.value }}</ui-select-match>
                                <ui-select-choices repeat="item.id as item in weekMap">
                                    <div>{{ item.value }}</div>
                                </ui-select-choices>
                            </ui-select>
                        </div>
                    </div>
                </div>

                <div class="form-group margin-top-40">
                    <label class="col-md-2 control-label" style="text-align: center">名称模板</label>

                    <div class="col-md-10">
                        <input id="nameTpl" ng-model="setting.name_tpl" type="text" class="form-control toggle-right" value="<%- setting.name_tpl %>" placeholder="输入包含[start_date]或[end_date]会替换为实际值"/>
                    </div>
                </div>

                <div class="form-group margin-top-40">
                    <label class="col-md-2 control-label" style="text-align: center">后续安排模板</label>

                    <div class="col-md-10">
                        <textarea id="nextTpl" ng-model="setting.next_tpl" class="form-control toggle-right" placeholder="输入包含[start_date]或[end_date]会替换为实际值"><%- setting.next_plan_tpl %></textarea>
                    </div>
                </div>
                <button class="btn btn-success col-md-6 col-md-offset-3 fa fa-book toggle-right" style="margin-top: 40px;" ng-click="saveSetting()">
                    &nbsp;&nbsp;保存设置
                </button>
            </div>
        </div>
    </div>
</div>

<script>
    $(function ($) {
        var menu = $('.rm-nav').rMenu({
            minWidth: '960px'
        });
    });
</script>
</body>
</html>